<template>
	<div>
		<van-nav-bar title="登录界面" left-text="返回" left-arrow @click-left="onClickLeft" />
		<van-form @submit="onSubmit" >
			<van-cell-group inset>
				<van-field
					v-model="username"
					name="username"
					label="用户名"
					placeholder="用户名"
					:rules="[{ required: true, message: '请填写用户名' }]"
				/>
				<van-field
					v-model="password"
					type="password"
					name="password"
					label="密码"
					placeholder="密码"
					:rules="[{ required: true, message: '请填写密码' }]"
				/>
			</van-cell-group>
			<div style="margin: 16px">
				<van-button round block type="primary" native-type="submit"> 登录 </van-button>
				<van-button round block type="primary" to="/register"> 未有账号？先注册 </van-button>
			</div>
		</van-form>
	</div>
</template>

<script setup lang="ts">
import { userLogin } from '@/hooks/login'
const { onSubmit, onClickLeft, username, password } = userLogin()
</script>

<style scoped>
	.van-button{
		margin-top: 10px;
	}
</style>